<!DOCTYPE html>
<html>
<head>
<style>
#foo1 {
    background: url(400x400_green.png);
    background-repeat: no-repeat;
    width: 400px;
    height: 400px;
    padding: 20px;
    border: 20px dotted red;
}
#foo2 {
    background: url(400x400_green.png);
    background-position: -20px -20px;
    background-repeat: no-repeat;
    width: 400px;
    height: 400px;
    padding: 20px;
    border: 20px dotted red;
}
#foo3 {
    background: url(400x400_green.png);
    background-position: 20px 20px;
    background-repeat: no-repeat;
    width: 400px;
    height: 400px;
    padding: 20px;
    border: 20px dotted red;
}
</style>
</head>
<body>
<div id=foo1></div>
<div id=foo2></div>
<div id=foo3></div>
</body>
</html>

